
<template>
  <div v-if="!loading" class="guide customer-dialog">
    <div class="text-center">
      <div class="title">{{$t('public.finlshPosit')}}</div>
      <div class="sub-title">{{$t('public.finlshPositTip')}}</div>
      <div v-if="autoCustLength > 0 && currentBusinessObj.type === 'call'"><el-button type="primary" class="primary_btn" @click.stop="isDealog('bindExistCustomers2')">{{$t('customer.customerSlot.choseCustomerByOne')}}</el-button></div>
      <div v-if="currentBusinessObj.type !=='call' || currentBusinessObj.type==='call'&& autoCustLength<=0"><el-button type="primary" class="primary_btn" @click.stop="isDealog('addCustomerInfo')">{{$t('public.Positioning')}}</el-button></div>
    </div>
      <el-dialog :close-on-click-modal="false" modal-append-to-body lock-scroll top="10%"
                 :title="customerInfo.title"  :visible.sync="customerInfo.isdealog" v-if="customerInfo.isdealog">
        <add-customer
          :isTag="false"
          :isBlight = "false"
          :labelValue = "customerInfo.labelValue"
          :labelTitle = "customerInfo.title"
          :reSize = "true"
          :isDalog = "customerInfo.isdealog"
          :isDailog = "true"
          :currentBusinessObj="currentBusinessObj"
          :custInfo="customer"
          :isTitle="isTitle"
          :select="select"
          :bindCustomer="bindCustomer"
          @addCustomer="addCustomer"
          @merge="mergeCustomer"
          @changeCustomeLabelValue="changeCustomeLabelValue"
          @closeDialog="closeDialog"
        ></add-customer>
      </el-dialog>
    </div>
</template>
<script>
  import addCustomer from '@/components/business-modules/customer/AddCustomer.vue'
  import * as webchatTypes from 'src/store/modules/webchat/mutation-types.js'
  import { isEmpty } from 'lodash'
  export default {
    name: 'guide',
    data () {
      return {
        customerInfo: {
          isdealog: false,
          labelValue: 3,
          title: ''
        },
        isMerge: true,
        isAdd: true,
        customerClickType: 'addCus',
        value: '',
        loading: true,
        status: null,
        source: [],
        agents: [],
        custCategorys: [],
        type1: 'call',
        type2: 'talk',
        isTitle: true,
        bindCustomer: {  // 绑定已存在客户的数据
          searchShow: true,
          custObj: {},
          form: {}
        },
        // replayData 定位到的客户信息
        autoCustPerson: '',
        callPhoneNum: ''
      }
    },
    props: {
      select: String,
      customer: {
        default: function () {
          return {}
        },
        type: Object
      },
      custType: String,
      currentBusinessObj: Object,
      callScreen: Boolean,
      webchatData: Object
    },
    computed: {
      autoCustLength () {
        let type = this.currentBusinessObj.type
        if (type === 'webchat' && this.$store.state.webchat.autoCust[this.currentBusinessObj.callId]) {
          return this.$store.state.webchat.autoCust[this.currentBusinessObj.callId].autoCustLength || 0
        } else if (type === 'email') {
          if (this.$store.state.email.autoCust && this.$store.state.email.autoCust.autoCustLength) {
            return this.$store.state.email.autoCust.autoCustLength
          } else {
            return 0
          }
        } else if (type === 'call') {
          let callArr = this.$route.path.split('/')
          let callSheetId = callArr[4]
          let callType = callArr[3]
          let currentObj = this.$store.state.call.current[callType]
          let phoneNum = ''
          if (currentObj) {
            let callInfo = currentObj.callInfo
            if (callInfo) {
              phoneNum = callInfo.QUICK_QUERY_NUM || callInfo.CALLED_NO
            }
          }
          this.callPhoneNum = phoneNum
          if (this.$store.state.call.autoCust && this.$store.state.call.autoCust[callSheetId] && this.$store.state.call.autoCust[callSheetId].autoCustLength) {
            return this.$store.state.call.autoCust[callSheetId].autoCustLength
          } else {
            return 0
          }
        }
      }
    },
    components: {
      addCustomer
    },
    methods: {
      addCustomer (form) {
        if (form === 'call') { // 解决通话新增客户之后，窗体无法消失的问题 liyl
          this.customerInfo.isdealog = false
          return
        }
        this.customerInfo.isdealog = true
        if (this.currentBusinessObj.type === 'webchat' && this.webchatData) {
          form.chatSessionInfo = {
            'seoSource': this.webchatData.seoSource || '',
            'seoKeywords': this.webchatData.seoKeywords || '',
            'ip': this.webchatData.ip || '',
            'fromUrl': this.webchatData.fromUrl || '',
            'urlTitle': this.webchatData.urlTitle || '',
            'area': this.webchatData.area || ''
          }
        }
        if (this.currentBusinessObj.type === 'call') {
          if (this.currentBusinessObj.tabType !== 'cdr_call') {
            let callObj = this.$store.state.call.current[this.currentBusinessObj.tabType]
            if (callObj) {
              let callInfo = callObj.callInfo
              if (callInfo && callInfo.CONNECT_TYPE) {
                if (callInfo.CONNECT_TYPE === 'normal' || callInfo.CONNECT_TYPE === 'transfer') {
                  form.callTel = callInfo.CALL_NO
                } else {
                  form.callTel = callInfo.CALLED_NO
                }
              }
            }
            form.dealSrc = 'relocationCall'
            form.actionType = 'self'
            if (this.currentBusinessObj.tabType === 'cdr_outbound') {
              form.dealSrc = 'dialPopup'
            }
          }
        }
        this.$store.dispatch('addCustomer', form).then((val) => {
          if (val.success) {
            form.customerInfo = val.data
            this.$emit('addCustomer', form, val.data)
            this.customerInfo.isdealog = false
            this.$store.commit('call/TEMP_CUSTOMER_DATA', {callId: form.callId, customer: val.data})
            this.$store.commit('call/UPDATE_CURRENT_CUSTOMER_INFO', {callId: form.callId, customer: val.data}) // 更新当前通话记录的客户信息
          }
        })
      },
      mergeCustomer (val) {
        this.$emit('merged', val)
        if (this.customer) {
          this.customerInfo.isdealog = false
        }
      },
      isDealog (flag) {
        this.customerInfo.isdealog = true
        if (flag === 'addCustomerInfo') {
          this.customerInfo.title = this.$t('customer.customerSlot.addCustomer')
          this.customerInfo.labelValue = 3
          this.isTitle = true
          this.bindCustomer.searchShow = true
          let arr = this.$route.path.split('/')
          let type = arr[2]
          if (type === 'webchat') {
            this.$emit('autoPerson', this.autoCustPerson)
            this.bindCustomer.custObj = {}
            this.bindCustomer.form = {}
          }
        } else if (flag === 'megerCustomerInfo') {
          this.customerInfo.title = this.$t('customer.customerSlot.choseCustomer')
          this.customerInfo.labelValue = 6
          this.isTitle = true
          this.bindCustomer.form = null
          this.bindCustomer.custObj = null
          this.bindCustomer.searchShow = true
        } else if (flag === 'bindExistCustomers2') {
          this.customerInfo.title = this.$t('customer.customerSlot.changeBind3')
          this.customerInfo.labelValue = 6
          this.isTitle = false
          if (this.$route.path.split('/')[2] === 'call') {
            this.bindCustomer.searchShow = true
            this.bindCustomer.form = {'field': 'phone', 'combox': this.callPhoneNum, 'custType': 'call', 'page': 1, 'limit': 10}
          } else {
            this.bindCustomer.searchShow = false
          }
          // this.bindCustomer.form.importSid = this.$store.state.webchat.autoCust[this.$route.path.split('/')[4]].importSid || ''
          if (this.$route.path.split('/')[2] === 'webchat') {
            this.bindCustomer.form.importSid = this.$store.state.webchat.autoCust[this.$route.path.split('/')[4]].importSid || ''
            if (!this.autoCustPhone && !this.autoCustName && !this.bindCustomer.form.importSid) {
              this.customerInfo.isdealog = false
              let info = {
                autoCustName: this.$store.state.webchat.autoCust[this.$route.path.split('/')[4]].autoCustName || this.autoCustName,
                autoCustPhone: this.$store.state.webchat.autoCust[this.$route.path.split('/')[4]].autoCustPhone || this.autoCustPhone,
                autoMatchContent: this.$store.state.webchat.autoCust[this.$route.path.split('/')[4]].autoMatchContent,
                autoMatchType: this.$store.state.webchat.autoCust[this.$route.path.split('/')[4]].autoMatchType,
                autoCustObj: {},
                autoCustLength: 0,
                importSid: this.$store.state.webchat.autoCust[this.$route.path.split('/')[4]].importSid
              }
              this.$store.commit(webchatTypes.AUTO_CUST_INFO, {sessionId: this.$route.path.split('/')[4], data: info})
            }
          }
          this.bindCustomer.custObj = this.autoCustObj
        }
      },
      changeCustomeLabelValue (label) {
        this.customerInfo.labelValue = label.labelValue
        this.customerInfo.title = label.title
      },
      // TODO 座席权限控制和公海
      fetchData () {
        this.loading = true
        let p1 = this.$store.dispatch('getCache', { type: 'custTmpls' })
        let p2 = this.$store.dispatch('getCache', { type: 'agents' })
        let p3 = this.$store.dispatch('getCache', { type: 'custCategorys' })
        let p4 = this.$store.dispatch('getCache', { type: 'options', id: 'd7b9c68a-b50f-21d1-d5fd-41ea93f5f49c' })
        Promise.all([p1, p2, p3, p4]).then(([custTmpls, agents, custCategorys]) => {
          let custTmpl = custTmpls[0] || []
          let statusConfig = custTmpl.statusConfig || {}
          let status = JSON.parse(JSON.stringify(custTmpl.status))
          // this.stutasSelect = JSON.parse(JSON.stringify(custTmpl.status))
          if (statusConfig) {
            for (let key in status) {
              if (statusConfig[key] && statusConfig[key].status !== 'enabled') {
                delete status[key]
              }
            }
          }
          this.status = !isEmpty(status) ? status : null
          this.source = custTmpls[0].source || []
          this.agents = agents || []
          this.custCategorys = custCategorys
          this.loading = false
        })
      },
      closeDialog (value) {
        this.customerInfo.isdealog = value
      }
    },
    beforeMount () {
      this.fetchData()
    }
  }
</script>
<style lang="stylus" scoped>
  .guide
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    margin: auto;
    height: 90px;
    .text-center
      text-align center
    .title
      font-size 16px
      font-weight bold
      margin-bottom 7px
    .sub-title
      margin-bottom 7px
</style>
